<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>节点之间连多条线</title>
</head>
<body>
<div id="mountNode"></div>
<script src="../build/g6.js"></script>
<script>
  const graph = new G6.Graph({
    container: 'mountNode',
    width: 800,
    height: 600,
    defaultNode: {
      size: [40, 40]
    },
    modes: {
      default: [ 'drag-node', 'drag-canvas' ]
    }
  });

  const data = {
    nodes: [
      {
        id: 'node1',
        label: 'node1',
        x: 500,
        y: 200,
        anchorPoints: [[0, 1], [0.5, 1]],
        shape: 'rect'
      },
      {
        id: 'node2',
        label: 'node2',
        x: 300,
        y: 400,
        anchorPoints: [[0.5, 0], [1, 1]],
        shape: 'rect'
      }
    ],
    edges: [
      {
        source: 'node1',
        target: 'node2',
        sourceAnchor: 0,
        targetAnchor: 0,
        style: {
          endArrow: true
        }
      },
      {
        source: 'node2',
        target: 'node1',
        sourceAnchor: 1,
        targetAnchor: 1,
        style: {
          endArrow: true
        }
      }
    ]
  }

  graph.data(data)
  graph.render()

  graph.getNodes().forEach(node => {
    const anchor = node.getAnchorPoints()
    console.log(anchor)
  })
  
</script>
</body>
</html>
